
<!doctype html>
<html lang="zxx">

<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>zlx</title>
  <!-- Template CSS -->
  <link rel="stylesheet" href="assets/css/style-starter.css">
  <!-- Template CSS -->
  <link href="http://fonts.googleapis.com/css?family=Spartan:400,500,600,700,900&display=swap" rel="stylesheet">
  <link rel="shortcut icon" href="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/zlx.ico" type="image/x-icon">
  <!-- Template CSS -->
	<style type="text/css">
		/* .diace li{
			margin: 0;
			margin-bottom: 28px;
		} */
	</style>
</head>
<body>
  <!-- /Homepage-->
  <section class="w3l-banner-main">
    <!-- //Header -->
    <section class="banner-main-inf" id="section07">
      <header id="site-header" class="header-top">
        <nav class="navbar navbar-expand-lg shift " id="header">
          <a class="navbar-brand" href="index.html">
            Ideal<span class="dot-1">.</span>
          </a>
          <button class="navbar-toggler bg-gradient" type="button" data-toggle="collapse"
            data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false"
            aria-label="Toggle navigation"><span class="navbar-toggler-icon fa fa-bars"> </span>
          </button>

          <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
            <ul class="navbar-nav ml-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#site-header">首页<span class="sr-only">(当前)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link effect-3" href="#gyw">关于我</a>
              </li>
              <li class="nav-item">
                <a class="nav-link effect-3" href="#wdzp">我的作品</a>
              </li>
             
              <li class="nav-item">
                <a class="nav-link effect-3" href="#gzjl">工作经历</a>
              </li>
            </ul>
          </div>
        </nav>
      </header>
      <!-- //Header -->
      <!--/banner-content-->
      <div class="bannerhny-content text-center">
        <div class="layer">
          <div class="bannerhnyinf">
            <h6>您好 !!!</h6>
            <h3>我是 ZLX</h3>
            <h4 class="ban-t"> 我擅长 <span class="typed-text"></span><span class="cursor">&nbsp</span></h4>
            <div class="scroll-button">
              <a href="#about" class="scroll">
                <div class="icon-scroll">
                  <div class="mouse">
                    <div class="wheel"></div>
                  </div>
                  <div class="icon-arrows">
                    <span></span>
                  </div>
                </div>
              </a>
            </div>
          </div>
        </div>
        <!--//banner-content-->
      </div>
      </div>
    </section>
    <!-- //Homepage -->
<section class="w3l-content-w-photo-6" id="about">
	<!-- /content-grids-->
	<div class="content-photo-info py-5" id="gyw">
		<div class="container py-lg-3">
			<!-- /row-->
			<div class="content-photo-grids row mt-lg-5 mt-4">
				<div class="photo-6-inf-left col-lg-6 pr-lg-4">
					<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/ab.jpg" class="img-fluid" alt="">
				</div>
				<div class="photo-6-inf-right col-lg-6 text-left pl-lg-5">
					<h3 class="hny-title">
						关于我<span class="dot-1">.</span></h3>
					<p>1、软件行业设计出身，目前从事产品经理岗位工作；</p>
					<p>2、18年从事UI设计工作，独立负责过多个B端、C端项目的UI/UX设计；</p>
					<p>3、22年公司内部转岗产品经理，负责过MES、SCM等多个B端从业务调研、需求输出、开发排期到上线等工作；</p>
					<p>4、所经历项目多是从0-1，熟悉新项目从开展到上线的整个流程；</p>
					<p>5、从事UI时全面了解过js、vue等技术、框架，较为熟悉前端工作原理，更有利于项目设计规范搭建，沟通；</p>
					<p>6、工具类(产品)：熟练使用axure、墨刀等设计工具；</p>
					<p>6、工具类(设计)：熟练使用masterGo、sketch、figma、ps、ai、ae等设计工具，C4D、blender等三维软件；</p>
					<p>6、工具类(数字孪生)：了解qgis数据处理，CityEngine程序化建模，unity、ue5等数字孪生常用技术。</p>
					<!-- <div class="read-more mt-lg-5 mt-4">
						<a href="about.html" class="read-more">
							<span class="more_icon fa fa-long-arrow-right"></span>
							<span class="more_text">查看更多</span>
						</a>
					</div> -->
				</div>
			</div>
			<!-- //row-->
			<!-- /row-->
			<!-- <div class="about-content-grids row py-lg-5 py-4 mt-lg-5 mt-4">
				<div class="col-lg-4 col-md-6 about-gd mt-3">
					<div class="about-gd-inn">
						<span class="fa fa-magic icon-fea1" aria-hidden="true"></span>
						<h5><a href="#URL">Modern design</a></h5>
						<p>Lorem ipsum dolor sit amet,Ea consequuntur illum facere.</p>

					</div>
				</div>
				<div class="col-lg-4 col-md-6 about-gd mt-3">
					<div class="about-gd-inn">
						<span class="fa fa-umbrella icon-fea1" aria-hidden="true"></span>
						<h5><a href="#URL">User Experience</a></h5>
						<p>Lorem ipsum dolor sit amet,Ea consequuntur illum facere .</p>

					</div>
				</div>
				<div class="col-lg-4 col-md-6 about-gd mt-3">
					<div class="about-gd-inn">
						<span class="fa fa-pencil-square-o icon-fea1" aria-hidden="true"></span>
						<h5><a href="#URL">Powerful Editor</a></h5>
						<p>Lorem ipsum dolor sit amet,Ea consequuntur illum facere.</p>

					</div>
				</div>

			</div> -->
			<!-- //row-->

		</div>
	</div>
</section>
<!-- //content-grids-->

<section class="w3l-content-6">
	<!-- /content-6-section -->
	  <div class="content-6-mian py-5">
			 <div class="container py-lg-3">
					 <div class="content-info-in row">
							 <div class="content-gd col-lg-5">
								<h3 class="hny-title">我的技能掌握<br>熟练度<span class="dot-1">.</span>
							 </div>
							 <div class="content-gd col-lg-7">
								<div class="progress-info">
									<h6 class="progress-tittle">UI/UX设计</h6>
									<div class="progress">
										<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 90%" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100">
										</div>
									</div>
								</div>
								<div class="progress-info">
									<h6 class="progress-tittle">产品设计</h6>
									<div class="progress">
										<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 80%" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100">
										</div>
									</div>
								</div>
								<div class="progress-info">
									<h6 class="progress-tittle">C4D、Blender三维设计
									</h6>
									<div class="progress">
										<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 60%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100">
										</div>
									</div>
								</div>
								<div class="progress-info">
									<h6 class="progress-tittle">UE5、Unity开发
									</h6>
									<div class="progress">
										<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 25%" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100">
										</div>
									</div>
								</div>
								<div class="progress-info">
									<h6 class="progress-tittle">HTML/CSS/JS/VUE</h6>
									<div class="progress">
										<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 30%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
										</div>
									</div>
								</div>
								<div class="progress-info">
									<h6 class="progress-tittle">品牌/运营设计</h6>
									<div class="progress">
										<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 70%" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100">
										</div>
									</div>
								</div>
							 </div>
					 </div>
				 </div>
			 </div>
	 </section>
   <!-- //content-6-section -->

  
<section class="w3-gallery" id="wdzp">
	<!-- Portfolio -->
	<div class="portfolio py-5">
		<div class="container py-lg-5">

			<h3 class="hny-title">我的作品<span class="dot-1">.</span></h3>
			
			<!-- /Portfolio-grids -->
			<ul class="portfolio-categ filter my-md-5 my-4 p-0">
				<li class="port-filter all active">
					<a href="#">全部&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-24">
					<a href="#" title="2024">2024&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-23">
					<a href="#" title="2023">2023&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-22">
					<a href="#" title="2022">2022&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-21">
					<a href="#" title="2021">2021&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-20">
					<a href="#" title="2020">2020&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-19">
					<a href="#" title="2019">2019&nbsp;&nbsp;·&nbsp;&nbsp;</a>
				</li>
				<li class="cat-item-18">
					<a href="#" title="2018">2018&nbsp;&nbsp;</a>
				</li>
				

			</ul>
			<!-- 口诀服务平台 -->
			<ul class="portfolio-area clearfix p-0 m-0 row diace">
				<li class="portfolio-item2 content" data-id="id-1" data-type="cat-item-23">
					<span class="image-block">
				
						<a class="image-zoom" href="product_01.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/SCM.jpg" class="img-fluid" alt="portfolio-img">
				
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">SCM供应链管理系统(2023)</h3>
				
							</div>
						</a>
					</span>
				</li>
				<li class="portfolio-item2 content" data-id="id-2" data-type="cat-item-22">
					<span class="image-block">
				
						<a class="image-zoom" href="product_00.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/YungJingNiang.jpg" class="img-fluid" alt="portfolio-img">
				
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">云精酿数字管理平台(2022)</h3>
				
							</div>
						</a>
					</span>
				</li>
				<li class="portfolio-item2 content" data-id="id-3" data-type="cat-item-21">
					<span class="image-block">	
						<a class="image-zoom" href="product_06.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/DaoGouLian.jpg" class="img-fluid" alt="portfolio-img">
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">导购链app(2021)</h3>
							</div>
						</a>
					</span>
				</li>
				<li class="portfolio-item2 content" data-id="id-4" data-type="cat-item-21">
					<span class="image-block">	
						<a class="image-zoom" href="product_04.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/ShangCheng.jpg" class="img-fluid" alt="portfolio-img">
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">口诀购物商城(2021)</h3>
							</div>
						</a>
					</span>
				</li>
				<li class="portfolio-item2 content" data-id="id-5" data-type="cat-item-21">
					<span class="image-block">	
						<a class="image-zoom" href="product_12.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/3D.jpg" class="img-fluid" alt="portfolio-img">
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">C4D练习(2021)</h3>
							</div>
						</a>
					</span>
				</li>
				<li class="portfolio-item2 content" data-id="id-6" data-type="cat-item-20">
					<span class="image-block">
						<a class="image-zoom" href="product_02.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/ERP.jpg" class="img-fluid" alt="portfolio-img">
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">ERP管理系统(2020)</h3>
							</div>
						</a>
					</span>
				</li>		
				<li class="portfolio-item2 content" data-id="id-7" data-type="cat-item-19">
					<span class="image-block">	
						<a class="image-zoom" href="product_09.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/YunYing.jpg" class="img-fluid" alt="portfolio-img">
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">运营设计(2017-2019)</h3>
							</div>
						</a>
					</span>
				</li>
				<li class="portfolio-item2 content" data-id="id-8" data-type="cat-item-18">
					<span class="image-block">	
						<a class="image-zoom" href="product_08.html" target="_blank">
							<div class="content-overlay"></div>
							<img src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/FengMian/CheWeiZhiJia.jpg" class="img-fluid" alt="portfolio-img">
							<div class="content-details fadeIn-bottom">
								<h3 class="content-title">车位之家(2018)</h3>
							</div>
						</a>
					</span>
				</li>
			</ul>
		</div>

	</div>
</section>

<section class="w3l-customers-6" id="gzjl">
	<!--/customers -->
	<div class="customers-6-infhny py-5" style="background-color: #EEF2F6;">
		<div class="container py-lg-5">
			<!--/customers -->
			<div id="owl-demo2" class="owl-carousel owl-theme">
				<!--/slide1-->
				<div class="item">
					<div class="teastimonials-content">
						<div class="teastimonials-left" style="background-color: #EEF2F6;">
								<div class="teasti-innf">
										<p class="overview"><b>宁波乐惠国际工程装备股份有限公司</b><span class="city">产品经理/交互设计 ｜ 2022.02-至今</span></p>
										
										<p class="testimonial">
										<span style="font-weight: bold;">工作成果</span><br>
										1.自研系统：目前负责并完成上线的有旗下酒厂啤酒酿造数字化管理系统、自营啤酒厂供应链系统，南京设备厂供应链系统，宁波设备厂考勤管理系统<br>
										2.客户项目：目前负责并完成上线的有珠江啤酒酿造数字化管理系统，河南中沃酿造数字化管理系统<br>
										<span style="font-weight: bold;">工作内容</span><br>
										1.项目从0-1业务调研、需求、设计、开发排期<br>
										2.上线后业务培训，使用情况追踪，使用反馈汇总<br>
										3.了解系统上下游对接系统的处理逻辑，目前对接的有金蝶erp、鼎捷erp、Oracle ERP、公司自研自控系统<br>
										</p>
								</div>
						</div>
						<div class="teastimonials-right">
								<img
								src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/team5.jpg" class="img-fluid" alt="">
						</div>
					</div>
				</div>
				<!--//slide1-->
				<!--/slide1-->
				<div class="item">
					<div class="teastimonials-content">
						<div class="teastimonials-left" style="background-color: #EEF2F6;">
								<div class="teasti-innf">
										<p class="overview"><b>杭州布喃科技有限公司</b><span class="city">UI/UX设计师 ｜ 2020.11-2022.02</span></p>
										<p class="testimonial">1.负责口诀B端设计规范；<br>
										<span style="font-weight: bold;">工作成果</span><br>
										服装行业ERP系统、门店终端POS系统、门店移动端商城、导购员管理系统
										<span style="font-weight: bold;">工作内容</span><br>
										1.项目从0-1业务调研、需求、设计、开发排期<br>
										2.上线后业务培训，使用情况追踪，使用反馈汇总<br>
										3.了解系统上下游对接系统的处理逻辑，目前对接的有金蝶erp、鼎捷erp、Oracle ERP、公司自研自控系统<br>
										2.ERP管理系统从0-1PC端和手机端交互和设计<br>
										3.门店终端POS系统的交互和设计<br>
										4.小程序商城的用户端和b端配置设计和交互<br>
										5.导购链的b端及c端产品、交互、UI设计
										</p>
								</div>
						</div>
						<div class="teastimonials-right">
								<img
								src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/team2.jpg" class="img-fluid" alt="">
						</div>
					</div>
				</div>
				<!--//slide1-->
				<div class="item">
					<div class="teastimonials-content">
						<div class="teastimonials-left" style="background-color: #EEF2F6;">
								<div class="teasti-innf">
										<p class="overview"><b>河南中欣教育科技有限公司</b><span class="city">运营/UI设计师 ｜ 2019.10-2020.10</span></p>
										<p class="testimonial">1.中欣网校学习平台相关项目设计；<br>
										2.模拟考试、模拟答卷平台设计；<br>
										3.设计中欣网校，腾讯课堂，喜马拉雅等多个电商平台专题、详情页、封面、banner设计；<br>
										4.负责公司运营招生类的设计，抖音招生视频制作，公众号设计，朋友圈裂变海报等；<br></p>
								</div>
						</div>
						<div class="teastimonials-right">
								<img
								src="http://t56z0xbgn.hd-bkt.clouddn.com/GongGong/team3.jpg" class="img-fluid" alt="">
						</div>
					</div>
				</div>
				<!--//slide1-->
			</div>
			<!--//customers -->
		</div>
</section>
<!-- //customers-6-->
    <!--/w3l-download-main-->
    <section class="w3l-download-main">
    	<!--/download-->
    	<div class="download-content text-center">
    		<div class="layer-2 py-5">
    			<div class="container py-lg-3">
    				<h3 class="hny-title two">173 3812 1582<span class="dot-1">.</span></h3>
    				<h6>2892294048@qq.com</h6>
    				<div class="read-more mt-lg-5 mt-4">
    					<!-- <a href="contact.html" class="read-more">
    						<span class="more_icon fa fa-long-arrow-right"></span>
    						<span class="more_text">Get In Touch</span>
    					</a> -->
    				</div>
    			</div>
    		</div>
    	</div>
    	</div>
    	<!--//download-->
    </section>
    <!--//w3l-download-main-->
<!-- footer -->
<footer class="w3l-footer-16">
    <div class="footer-content py-lg-5 py-4 text-center">
        <div class="container">
            <div class="row copy-right">
                <div class="col-lg-12 footer-left text-lg-left text-center">
                    <h6 style="text-align: center;">--</h6>
                </div>
            </div>
            <button onclick="topFunction()" id="movetop" title="Go to top">
                <span class="fa fa-angle-up"></span>
            </button>
        </div>
    </div>

    <!-- move top -->
    <script>
        // When the user scrolls down 20px from the top of the document, show the button
        window.onscroll = function () {
            scrollFunction()
        };

        function scrollFunction() {
            if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
                document.getElementById("movetop").style.display = "block";
            } else {
                document.getElementById("movetop").style.display = "none";
            }
        }

        // When the user clicks on the button, scroll to the top of the document
        function topFunction() {
            document.body.scrollTop = 0;
            document.documentElement.scrollTop = 0;
        }
    </script>
    <!-- //move top -->
    <script>
        $(function () {
            $('.navbar-toggler').click(function () {
                $('body').toggleClass('noscroll');
            })
        });
    </script>
</footer>
<!-- //footer -->
<style>
.copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
</style>
</body>

</html>

<script src="assets/js/jquery-3.3.1.min.js"></script>
<!-- disable body scroll which navbar is in active -->

<!--//-->
<script>
  $(function () {
    $('.navbar-toggler').click(function () {
      $('body').toggleClass('noscroll');
    })
  });
</script>
<!--/scroll-down-JS-->
<script>
  $(function () {
    $('a[href*=#]').on('click', function (e) {
      e.preventDefault();
      $('html, body').animate({
        scrollTop: $($(this).attr('href')).offset().top
      }, 500, 'linear');
    });
  });
</script>
<!--//scroll-down-JS-->
<!-- /typig-text-->
<script>
  const typedTextSpan = document.querySelector(".typed-text");
  const cursorSpan = document.querySelector(".cursor");

  const textArray = ["产品设计", '用户体验', '交互设计', 'UI设计'];
  const typingDelay = 200;
  const erasingDelay = 10;
  const newTextDelay = 100; // Delay between current and next text
  let textArrayIndex = 0;
  let charIndex = 0;

  function type() {
    if (charIndex < textArray[textArrayIndex].length) {
      if (!cursorSpan.classList.contains("typing")) cursorSpan.classList.add("typing");
      typedTextSpan.textContent += textArray[textArrayIndex].charAt(charIndex);
      charIndex++;
      setTimeout(type, typingDelay);
    } else {
      cursorSpan.classList.remove("typing");
      setTimeout(erase, newTextDelay);
    }
  }

  function erase() {
    if (charIndex > 0) {
      // add class 'typing' if there's none
      if (!cursorSpan.classList.contains("typing")) {
        cursorSpan.classList.add("typing");
      }
      typedTextSpan.textContent = textArray[textArrayIndex].substring(0, 0);
      charIndex--;
      setTimeout(erase, erasingDelay);
    } else {
      cursorSpan.classList.remove("typing");
      textArrayIndex++;
      if (textArrayIndex >= textArray.length) textArrayIndex = 0;
      setTimeout(type, typingDelay);
    }
  }

  document.addEventListener("DOMContentLoaded", function () { // On DOM Load initiate the effect
    if (textArray.length) setTimeout(type, newTextDelay + 250);
  });
</script>
<!-- //typig-text-->
<!-- for blog carousel slider -->
<script src="assets/js/owl.carousel1.js"></script>
<script>
  $(document).ready(function () {
    $("#owl-demo2").owlCarousel({
      items:1,
		        lazyLoad : true,
		        autoPlay : true,
		        navigation : false,
			    navigationText : ["",""],
			    rewindNav : false,
			    scrollPerPage :true,
			    pagination : false,
    			paginationNumbers: false,
      
    })
  })
</script>


<!-- //for blog carousel slider -->
<!-- jQuery-Photo-filter-lightbox-portfolio-plugin -->
<script src="assets/js/jquery-1.7.2.js"></script>
<script src="assets/js/jquery.quicksand.js"></script>
<script src="assets/js/script.js"></script>
<script src="assets/js/jquery.prettyPhoto.js"></script>
<!-- //jQuery-Photo-filter-lightbox-portfolio-plugin -->

<script src="assets/js/bootstrap.min.js"></script>